.disconnect-site__card {
	position: relative;
	padding: 24px;

	@include breakpoint-deprecated( '<480px' ) {
		max-width: 300px;
	}

	@include breakpoint-deprecated( '<660px' ) {
		margin-top: 2em;
		max-width: 500px;
	}

	@include breakpoint-deprecated( '>660px' ) {
		margin-top: 17px;
		max-width: 800px;
	}
}

.disconnect-site__down-flow {
	> p {
		font-size: 14px;
		padding: 0 20px;
		text-align: center;
		color: var( --color-neutral-50 );
	}
}

.disconnect-site__actions {
	$title-size: 16px;

	margin-bottom: 1.5em;

	.card {
		// .card.is-card-link’s padding-right
		padding-left: 48px;

		.formatted-header {
			margin-top: 0;
			margin-bottom: 0;
			margin-left: 0;
		}

		.formatted-header__title {
			font-size: $title-size;
		}

		.formatted-header__subtitle {
			margin-bottom: 0;
		}
	}

	.disconnect-site__action-icon {
		position: absolute;

		$padding: 16px; // .card’s padding
		$icon-height: 24px; // Gridicon’s intrinsic height
		$text-height: $title-size * 1.2; // formatted-header__title’s line-height (without em)
		top: $padding - ( $icon-height - $text-height ) / 2;
		left: $padding;
	}

	.disconnect-site__confirm-icon {
		color: var( --color-primary-40 );
	}

	.disconnect-site__troubleshoot-icon {
		color: var( --color-jetpack );
	}

	.disconnect-site__disconnect-icon {
		color: var( --color-error-40 );
	}
}

.disconnect-site__site-settings {
	.section-header__label::before {
		background: inherit;
	}
}

.disconnect-site__survey-other-option {
	align-items: center;
	display: flex;
	white-space: nowrap;

	.form-text-input {
		line-height: 1em;
		margin-left: 8px;
	}
}

.disconnect-site__navigation-links {
	text-align: center;
}

// 'Missing Feature' page
.disconnect-site__missing-feature {
	.button {
		margin-top: 16px;
		float: right;
	}
}
